{% extends 'main.html' %}



{% block title %}
    <title>主机信息</title>
{% endblock %}


{% block content %}



    <div class="panel">
        <div class="panel-heading">
            <h3 class="panel-title">主机列表</h3>
        </div>
        <div class="panel-body">
            <!--List Group with Badges-->
            <!--===================================================-->
            <ul class="list-group">
                <li onclick="show(this)" class="list-group-item"><span class="badge badge-primary active">{{ request.user.host_groups.count }}</span>主机组</li>
                    <div class="panel" id="group">
                        <div class="panel-body">
                            <div class="list-group">
                               {% for group in request.user.host_groups.all %}
                                <a onclick="show_host(this)" name="group_itmes" class="list-group-item list-item-sm " href="#">{{ group }}<span class="badge badge-primary active">{{ group.host_to_remote_users.count }}</span></a>
                                                   <div>
                                                       {% for host in group.host_to_remote_users.all %}
                                                              <a tag=item class="list-group-item list-item-sm " href="#">名称：{{ host }} -------  ip：{{ host.host.ip }}</a>
                                                       {% endfor %}
                                                   </div>

                                {% endfor %}
                            </div>
                        </div>
                    </div>


                <li onclick="show(this)" class="list-group-item"><span class="badge badge-success">{{ request.user.host_to_remote_users.count }}</span>未分组主机</li>
                 <div class="panel" id="host">
                        <div class="panel-body">
                            <div class="list-group">
                               {% for host in request.user.host_to_remote_users.all %}
                                    <div><a class="list-group-item list-item-sm " href="#">名称：{{ host }} -------  ip：{{ host.host.ip }}</a></div>
                                {% endfor %}
                            </div>
                        </div>
                    </div>
            </ul>
            <!--===================================================-->

        </div>
    </div>
{% block diyjs %}

<script>
    $(function () {
        $('#host').hide();
        $('#group').hide();
        $("a[name='group_itmes']").next().hide()
        });
    function show(ths){
        $(ths).next().toggle()
    }

    function show_host(ths){
        $(ths).next().toggle()
    }

</script>


{% endblock %}

{% endblock %}
